{% extends "layout/base.html" %}
{% block title %} Profil utilisateur {% endblock %}

{% block content %}
{% include 'layout/header.html' %}
{% include 'layout/infosBox.html' %}
<div id="content" class="{{theme.color3}}">
{% if id_user == session.id_user %}
<div id="creerAvailability" class="{{theme.color1}}">
	<h4>Créer une disponibilité</h4>
	<form method="post" id="ajouterAvailability" action="profil.php" class="form-elem">
		<div class="form-elem left" >
			<label>Date de début de disponibilité :</label>
	        <input type="date" name="date_begin" placeholder="Ex : 2013-06-05" value="" required/>
	        <label>Heure de début de disponibilité :</label>
	        <input type="text" name="time" placeholder="Ex : 23:45:00" value="" required/>
	        <label>Durée proposée :</label>
	        <input type="text" name="duration" placeholder="Ex : 2:00:00" value="" required />
	        <label>Prix fixé (€) :</label>
	        <input type="text" name="price" placeholder="Entrez un prix" value="" required />
	    </div>
        <div class="form-elem right" >
	        <label for="none" class="radio">
	            <input id="none" type="radio" name="reccurence" value="none" checked /><span>Ponctuelle</span>
	        </label>
	        <label for="daily" class="radio">
	            <input id="daily" type="radio" name="reccurence" value="daily" /> Quotidienne
	        </label>
	        <label for="weekly" class="radio">
	            <input id="weekly" type="radio" name="reccurence" value="weekly" /> Hebdomadaire
	        </label>
	        <label for="monthly" class="radio">
	            <input id="monthly" type="radio" name="reccurence" value="monthly" /> Mensuelle
	        </label>
	        <label for="yearly" class="radio">
	            <input id="yearly" type="radio" name="reccurence" value="yearly" /> Annuelle
	        </label>
	    </div>
	    <div class="clr" ></div>
        <input type="submit" name="ajouterAvailability" value="Ajouter une disponibilité" class="btn btn-primary {{theme.color3}}" />
    </form>
</div>
{% else %}
<div id="messages" class="{{theme.color1}}">
	<h4>Développement de la messagerie et de la description dans un futur proche.</h4>
</div>
{% endif %}
<div id="profil" class="{{theme.color2}}">
	{% if profil %}
	<h4>Vos informations personnelles</h4>
	<ul>
		{% for prof in profil %}
		<li>{{prof.firstname}} {{prof.lastname}}</li>
		<li>Votre mail : {{prof.mail}}</li>
		<li>Votre anniversaire : {{prof.birthday}}</li>
		<p><a href="edit.php?infosP">Modifier vos informations personnelles.</a></p>
		{% endfor %}
		<h4>Vos catégories</h4>
		{% if litCategoriesUser %}
			<p>{{litCategoriesUser}}</p>
			<p><a href="edit.php?categorie">Modifier vos catégories.</a></p>
		{% else %}
		<p> Vous n'avez encore aucune catégorie de sélectionnée. </p>
		<a href="edit.php?categorie">Aller vite remédier à ça.</a>
		{% endif %}
	</ul>
	{% endif %}
</div>
<div class="clr"></div>
<div id="availability">
	{% if avaibilities %}
	<h4>Vos disponibilités</h4>
	<table class="table table-hover">
	    <thead>
	        <tr>
	            <th>Jours / Dates</th>
	            <th>Récurrence</th>
	            <th>Durée</th>
	            <th>Prix fixé (€)</th>
	            {% if id_user == session.id_user or session.rights == 'ADMIN' %}
	            <th>Supprimer</th>
	            {% endif %}
	        </tr>
	    </thead>
	    <tbody>
	        {% for availability in avaibilities %}
	            <tr>
	                {% if availability.daily %}
	                    <td>Tous les jours</td>
	                    <td>quotienne</td>
	                {% elseif availability.weekly %}
	                    <td>Tous les {{availability.dayweek|title}}</td>
	                    <td>hebdomadaire</td>
	                {% elseif availability.monthly %}
	                    <td>Tous les {{availability.daymonth}} du mois</td>
	                    <td>mensuelle</td>
	                {% elseif userTime.yearly %}
	                    <td>Tous les {{availability.dayyear}}</td>
	                    <td>annuelle</td>
	                {% else %}
	                    <td>{{availability.date_begin}}</td>
	                    <td>ponctuelle</td>
	                {% endif %}
	                    <td>{{availability.duration}}</td>
	                <td>{{availability.price}}</td>
	                {% if id_user == session.id_user or session.rights == 'ADMIN' %}
	                <td>
	                	<form method="post" id="supprAvailability" class="supprAvailability" action="profil.php" class="form-elem">
	                        <input type="hidden" name="id_availability" value="{{availability.id_availability}}" />
	                        <input type="submit" name="supprimerAvailability" value="" class="btnSuppr" />
	                    </form>
	                </td>
	                {% endif %}
	            </tr>
	        {% endfor%}
	    </tbody>
	</table>
	</div>
	{% else %}
	    <p style="text-align:center">Vous n'avez pas encore de temps disponible.</p>
	{% endif %}
	{% include 'layout/module.html' %}
</div>
{% include 'layout/footer.html' %}
<script type="text/javascript">
$('#ajouterAvailability').validate({
		rules: {
			date_begin: {
				required: true,
				date: true
			},
			time: {
				required: true
			},
			duration: {
				required: true
			},
			price: {
				required: true
			}
		},
		messages: {
			date_begin: {
				required: "Veuillez entrer une date de disponibilité svp.",
				date: "Le format doit être aaaa-mm-jj."
			},
			time: {
				required: "Veuillez entrer une heure de disponibilité de type hh:mm:ss."
			},
			duration: {
				required: "Veuillez entrer une durée de disponibilité de type hh:mm:ss."
			},
			price: {
				required: "Veuillez entrer un prix svp."
			}
		}
	});
</script>
{% endblock %}